<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script>
        window.onload=function(){
         var oTxt=document.getElementById('txt1');
         var oBtn=document.getElementById('btn1');
         oBtn.onclick=function(){
//             邮箱名称的规则
//   一串英文、数字、下划线  @  一串英文、数字  .  一串英文
//        \w+             @   [a-z0-9]+    \.  [a-z]+
           var re=/^\w+@[a-z0-9]+\.[a-z]+$/i;
           if(re.test(oTxt.value)){//正则有个方法test，用来检查这个字符串是不是符合这个正则的规则，符合的话，就是个true
//               test 字符串一部分符合要求  返回true
//               在正则中加了^  $，就会整个校验
             alert('合法的邮箱');
           }
           else{
               alert('你丫写错了');
           }

         };
        };
    </script>
</head>
<body>
<input type="text" id="txt1">
<input type="button" value="校验" id="btn1">
<!--[^abc]  ^出现在[]里面表示排除-->
<!--^出现在[]外面  表示行首（字符串开头）-->
<!--$  表示行尾（字符串结尾）-->
</body>
</html>